<template>
  <view class="fu-radio-group">
    <slot></slot>
  </view>
</template>

<script>
import { toRef } from 'vue'

/**
 * fu-radio-group 单选框组组件
 * @description 单选框组，用于包裹radio组件
 * @property {String | Number | Boolean} modelValue - 单选框组的值
 * @event {Function} update:modelValue - 值变化时触发
 * @event {Function} change - 值变化时触发
 */
export default {
  name: 'fu-radio-group',
  props: {
    modelValue: {
      type: [String, Number, Boolean],
      default: ''
    }
  },
  emits: ['update:modelValue', 'change'],
  setup(props, { emit }) {
    // 创建响应式引用
    const radioGroup = {
      modelValue: toRef(props, 'modelValue'),
      handleRadioChange: (value) => {
        emit('update:modelValue', value)
        emit('change', value)
      }
    }

    return {
      // 提供给子组件的上下文
      radioGroup
    }
  },
  provide() {
    return {
      radioGroup: this.radioGroup
    }
  }
}
</script>

<style lang="scss" scoped>
.fu-radio-group {
  display: inline-block;
}
</style> 